﻿<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Example20.aspx.cs" Inherits="Chapter03.Example20" %>

<!DOCTYPE html>

<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>代码清单 3-20 使用 hidden 属性</title>
    <script>
        var toggleHidden = function () {
            var elem = document.getElementById("toggle");
            if (elem.hasAttribute("hidden")) {
                elem.removeAttribute("hidden");
            } else {
                elem.setAttribute("hidden", "hidden");
            }

        }
    </script>
</head>
<body>
    <form>
        <div>
            <button onclick="toggleHidden()">Toggle</button>
            <table>
                <tr>
                    <th>Name</th>
                    <th>City</th>
                </tr>
                <tr>
                    <td>Adam Freeman</td>
                    <td>London</td>
                </tr>
                <tr id="toggle" hidden="hidden">
                    <td>Joe Smith</td>
                    <td>New York</td>
                </tr>
                <tr>
                    <td>Anne Jones</td>
                    <td>Paris</td>
                </tr>
            </table>
        </div>
    </form>
</body>
</html>
